<template>
  <div class="info-wrap">
    <Title title="创建信息" style="margin: 23px 0 8px 0" font-size="16px"/>
    <el-form
      :class="{'mobile-el-form': showMobilePage}"
      :label-position="showMobilePage?'left':'right'"
      label-width="110px"
      class="supplier-form height55">
      <el-row :gutter="20" :class="{'dividing': !showMobilePage}">
        <el-col :span="8">
          <el-form-item label="创建人：">
            <CheckUserInfo :label="detailInfo.createName" :user-id="detailInfo.createUserId" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="所属部门：">
            {{ detailInfo.department || '--' }}
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="系统ID：">
            {{ detailInfo.systemId || '--' }}
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>
<script>
import { mapState } from 'vuex';
import Title from '@/components/Title';

export default {
  components: { Title },
  props: {
    detailInfo: {// 详情信息
      type: Object,
      default: () => {}
    }
  },
  computed: {
    ...mapState({
      'showMobilePage': state => state.app.showMobilePage
    })
  }
};
</script>
